import { fonts } from "./fonts"

export interface cssable{
    labelName:string
    textColor:string,
    backgroundColor:string,
    font:string
}

export const textColorDefault = "#000000";
export const backgroundColorDefault = "#ffffff";
export const fontDefault = fonts[0];

export class Cssable implements cssable{
    constructor(labelName:string){
        this.labelName = labelName,
        this.textColor=textColorDefault,
        this.backgroundColor=backgroundColorDefault,
        this.font=fontDefault
    }
    labelName: string;
    textColor: string;
    backgroundColor: string;
    font: string;

    toCss(){
        const css = this.buildCssProps();
        if(css){
            return `${this.labelName}{${css}}`
        }
        else{
            return "";
        }
    }
    static toPreviewCss(css:string){
        if(css){
            return `div.preview ${css}`
        }
        else{
            return "";
        }
    }
    private buildCssProps(){
        var res="";
        if(this.textColor!=textColorDefault){
            res+=`color:${this.textColor};`
        }
        if(this.backgroundColor!=backgroundColorDefault){
            res+=`background-color:${this.backgroundColor};`
        }
        if(this.font!=fontDefault){
            res+=`font-family:'${this.font}'`
        }
        return res;
    }
}